<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link rel="stylesheet" type="text/css" href="css/styles.css">
	<link href="css/index.css" rel="stylesheet">
	<link rel="shortcut icon" href="favicon.ico" >
	
<title>注册登录页面</title>

<style>
       
* {
            padding: 0;
            margin: 0;
        }

 
html,body {
            width: 100%;
            height: 100%;
        }

 
.cms_login {
 
           width: 100%;
 
           height: 100%;
 
           display: flex;
  
          justify-content: center;
 
           background-repeat: no-repeat;
 
           background-image: url(img/p1.png);

            background-size: 100% 100%;
        }
.flexCenter {
            text-align: center;

            margin: auto;
        }


.cms_login_container {

            width: 70%;
 
           height: 70%;
 
           display: flex;

            justify-content: center;
        }


 .cms_login_image {

            width: 60%;

            height: 100%;
        }

 
 .cms_login_from {

            width: 40%;

            height: 100%;
 
           background-color: white;

            border-radius: 10px;

            box-shadow: 0px 0px 10px #ccc;
        }


  /* .cms_login_container {

            width: 30%;

            height: 70%;
 
           border: 1px solid red;
        }
 */

 img {
 
           width: 100%;

           height: 100%;
        }


 .divBox {

            display: flex;

            justify-content: center;

            width: 80%;

            height: 46px;

            margin-top: 20px;

            margin-left: 10%;

            position: relative;
        }

       
 .cms_login_logo {

            display: flex;

            justify-content: center;

            width: 80%;

            height: 60px;
            


        margin-left: 10%;
 
           margin-bottom: 22px;

            margin-top: 25px;
        }

 
 .cms_login_img {

            width: 44px;
 
           height: 44px;

            position: absolute;

            top: 1px;

            left: 1px;
        }

        
.cms_login_ipt {

            width: 100%;

            outline: none;

            padding-left: 50px;
        }

       
 .cms_login_ipt60 {

            width: 60%;

            outline: none;

            padding-left: 50px;
        }

        
.cms_login_ver {

            width: 30%;

            outline: none;

            margin-left: 8%;

            border: 1px solid #c32c2c;

            background-color: #bd7070;

            line-height: 46px;

            letter-spacing: 4px;

            border-radius: 4px;

            cursor: default;

            color: white;
        }


.cms_login_tb {

          
            margin:0 auto;
            
        }
       
 .margin_top60 {

            margin-top: 40px;
        }

        
.login_btn {
 
           width: 100%;

            height: 60px;

            letter-spacing: 10px;

            font-size: 24px;

            background-color: green;

            border: none;
 
           outline: none;
 
           border-radius: 10px;

            color: white;
            
            margin-top:-10%;
        }

       
 .login_btn:hover {

            background-color: #044468;

            border: none;

            outline: none;
        }
    </style>

</head>
<body>
<header>
  <div class="headtop">
    <div class="timer box"><span><a onclick="javascript:window.external.addFavorite('/','')" href="/">加入收藏</a> | <a onclick="this.style.behavior='url(#default#homepage)';this.setHomePage('/');" href="/">设为首页</a></span><script type="text/javascript" src="js/timer.js"></script></div>
  </div>
  </br>
  <div style="width:93%;text-align:right;">
 	 
	<!--  <a class="l" href="index.jsp" class="btn btn--stripe">返回主页</a> -->
	
  </div>
  <div class="logo box"></div>




	<div class="jq22-container" style="padding-top:100px">
		<div class="login-wrap">
			<div class="login-html">
				<input id="tab-1" type="radio" name="tab" class="sign-in" checked><label for="tab-1" class="tab">登录</label>
				<input id="tab-2" type="radio" name="tab" class="sign-up"><label for="tab-2" class="tab">注册</label>
			
				<div class="login-form">
				
					<div class="sign-in-htm">
					<!-- 有事发生 -->
					<!-- 有事发生 -->
					<!-- 有事发生 -->
					<!-- 有事发生 -->
					<form id="form1" name="form1" action="" method="post" onSubmit="check();">
						
						<div class="group">
							<label for="user" class="label">用户名</label>
							<input id="username" type="text" class="input" name="username">
						</div>
						<div class="group">
							<label for="pass" class="label">密码</label>
							<input id="password" type="password" class="input"  name="password">
						</div>
						
						<table id="RadioButtonList1" class="cms_login_tb" >
				<tbody><tr>
					<td><input name="RadioButtonList1" tabindex="4" id="admin" type="radio" value="村长">
						<label for="RadioButtonList1_1">村长</label></td>
		
					<td><input name="RadioButtonList1" tabindex="4" id="cadre" type="radio" value="村干部">
						<label for="RadioButtonList1_2">村干部</label></td><td>
		
							<input name="RadioButtonList1" tabindex="4" id="user" type="radio" checked="checked" value="村民">
						<label for="RadioButtonList1_3">村民</label></td><td>
		
						
						</tr>
				</tbody>
		</table>					
							<div class="group">
							<input type="submit" class="button" value="登录">
						</div>
						
			</form>
						
						
						
						<div class="hr"></div>
					</div>
					
					<div class="sign-up-htm">
					
					
					
			<form>
					
						<div class="group">
							<label for="user" class="label">用户名</label>
							<input id="rusername" type="text" class="input" name="username"  onblur="ajaxValidate()"   >
						</div>
						<div class="group">
							<label for="pass" class="label">密码</label>
							<input id="rpassword" type="password" class="input"  name="password">
						</div>
						
						<div class="group">
							<label for="pass" class="label">姓名</label>
							<input id="rname" type="text" class="input"  name="name">
						</div>
						
						<div class="group">
							<label for="pass" class="label">性别</label>
							<input id="rsex" type="text" class="input" name="sex">
						</div>
						
							<div class="group">
							<label for="pass" class="label">年龄</label>
							<input id="rage" type="text" class="input" name="age">
						</div>
						
						<div class="group">
							<label for="pass" class="label">电话</label>
							<input id="rphone" type="text" class="input" name="phone">
						</div>
						
						<div class="group">
							<!-- <input type="submit" class="button" value="注册" onclick="ajaxValidate()">  -->
						<button onclick="ajaxValidate()" class="button">注册</button> 
						</div>
						
							</form>
						
						<div class="hr"></div>	
					</div>
					
					
				</div>
			</div>
		</div>
	</div>
	
	
	
	
<script type="text/javascript" src="js/jquery-3.2.1.js"></script>
<script type="text/javascript">
function check(){
if(document.form1.admin.checked==true){
	document.form1.attributes["action"].value="AdminLogin";
}
if(document.form1.cadre.checked==true){
document.form1.attributes["action"].value="CadreLogin";
}
if(document.form1.user.checked==true){
	document.form1.attributes["action"].value="UserLogin";
	}

}


function ajaxValidate() {
    var username=$("#rusername").val();
    var password=$("#rpassword").val();
    var name=$("#rname").val();
    var sex=$("#rsex").val();
    var age=$("#rage").val();
    var phone=$("#rphone").val();
    $.ajax({
        type:"POST",
        url:"${pageContext.request.contextPath}/doCheckUsername",
        /**data:"username="+username, "password="+password,"name="+name,"sex="+sex,"age="+age,"phone="+phone ,**/
        data:{"username":username,"password":password,"name":name,"sex":sex,"age":age,"phone":phone},
        dataType:"json",
        success:function(data){
            if ("no" == data.msg) {
                alert("抱歉，该用户已被注册，请更换！");
            }else if("yes" ==data.msg)
              {
            	 alert("注册成功了！");
                 window.location.href="LR.jsp";
               }
        }
    });
}

</script>
	
</body>

</html>